<div class="clear"></div>

  
  <section id="main">
    <div class="container_12">
       <div id="sidebar" class="grid_3">
	      
	      {:W('Cate/getCategory',array($cateId))}
	      
	      <aside id="shop_by">
		     <h3>Shop By</h3>
		     
		     <div class="currently_shopping">
			    <p>Currently Shopping by:</p>
			    <ul>
				   <li><a title="close" class="close" href="#"></a>Price: <span>$0.00 - $999.99</span></li>
				   <li><a title="close" class="close" href="#"></a>Manufacturer: <span>Apple</span></li>
			    </ul>
			    
			    <a class="clear_all" href="#">Clear All</a>
			    
			    <div class="clear"></div>
		     </div><!-- .currently_shopping -->
		     
		     <h4>Category</h4>
		     
		     <form action="#" class="check_opt">
			    <p><input class="niceCheck" type="checkbox" >For Home (23)</p>
			    <p><input class="niceCheck" type="checkbox" name="" value="">For Car (27)</p>
			    <p><input class="niceCheck" type="checkbox" name="" value="">For Office (9)</p>
		     </form>
		     
		     <h4>Price</h4>
		     
		     <form action="#" class="check_opt">
			    <p><input class="niceCheck" type="checkbox" name="" value="">0.00 - $49.99 (21)</p>
			    <p><input class="niceCheck" type="checkbox" name="" value="">$50.00 - $99.99 (7)</p>
			    <p><input class="niceCheck" type="checkbox" name="" value="">0$100.00 and above (15)</p>
		     </form>
	      </aside><!-- #shop_by -->
	      
	      <aside id="specials" class="specials">
		     <h3>Specials</h3>
		     
		     <ul>
			    <li>
				   <div class="prev">
					  <a href="product_page.html"><img src="__IMG__/special1.png" alt="" title="" /></a>
				   </div>
				   
				   <div class="cont">
					  <a href="product_page.html">Honeysuckle Flameless Luminary Refill</a>
					  <div class="prise"><span class="old">$177.00</span>$75.00</div>
				   </div>   
			    </li>
			    
			    <li>
				   <div class="prev">
					  <a href="product_page.html"><img src="__IMG__/special2.png" alt="" title="" /></a>
				   </div>
				   
				   <div class="cont">
					  <a href="product_page.html">Honeysuckle Flameless Luminary Refill</a>
					  <div class="prise"><span class="old">$177.00</span>$75.00</div>
				   </div>   
			    </li>
		     </ul>
	      </aside><!-- #specials -->
	      
	      <aside id="newsletter_signup">
		     <h3>Newsletter Signup</h3>
		     <p>Phasellus vel ultricies felis. Duis 
		     rhoncus risus eu urna pretium.</p>
		     
		     <form class="newsletter">
			    <input type="email" name="newsletter" class="your_email" value="" placeholder="Enter your email address..."/>
			    <input type="submit" id="submit" value="Subscribe" />
		     </form>
	      </aside><!-- #newsletter_signup -->
       </div><!-- .sidebar -->
      
      
      
       <div id="content" class="grid_9">
	      <h1 class="page_title">产品列表</h1>
	      
	      <div class="options">
		     <div class="grid-list">
			   <a class="grid curent" href="index.html"><span>img</span></a>
			   <a class="list" href="catalog_list.html"><span>img</span></a>
		     </div><!-- .grid-list -->
		     <form id="perorder" action="" method='get'>
		     <div class="show">
			    每页显示
			    <select id="perpage" name="perpage">
				   <option value="3">每页显示</option>
				   <for start='3' end='13' name='ij' step='3'>
				   		 <if condition="($ij eq $pagedata['perpage'])" >
				   		 	<option selected value="{$ij}">-{$ij}-</option>
				   		 <else/>
							<option  value="{$ij}">-{$ij}-</option>
				   		 </if>
				   </for>
				   
			     </select>
			    条
		     </div><!-- .show -->
		     <div class="sort">
			   排序
			    <select id="orderby" name="orderby">
				   
				   <option value="shop_price">排序规则</option>
				   <if condition="($orderby) eq 'shop_price'">
				   		<option selected value="shop_price">价格</option>
				   		<option  value="ctime">上架时间</option>
				   <else/>
				   		<option value="shop_price">价格</option>
				   		<option selected value="ctime">上架时间</option>
			    	</if>
			     </select>
			    <a class="sort_up"  href="{:U(Index/proList,array('desca'=>$desca,'page'=>$pagedata[currpage]))}">&#8593;</a>
		     </div><!-- .sort -->
		     </form>
	      </div><!-- .options -->
	      
	      <div class="grid_product">
		    
		    <foreach name="proList" key="proKey" item="proValue">
			     <div class="grid_3 product">
				    <div class="prev">
					   <a href="{:U('Index/proDetail',array('id'=>$proValue['id']))}"><img src="__ROOT__/{$proValue['pic']}" alt="" title="" /></a>
				    </div><!-- .prev -->
				    <h3 class="title">{$proValue['name']}</h3>
				    <div class="cart">
					   <div class="price">
						  <div class="vert">
							 <div class="price_new">{$proValue['shop_price']}</div>
							 <div class="price_old">{$proValue['market_price']}</div>
						  </div>
					   </div>
					   <a href="#" class="obn"></a>
					   <a href="#" class="like"></a>
					   <a href="#" class="bay"></a>
				    </div><!-- .cart -->
			     </div><!-- .grid_3 -->
		     </foreach>
		    

	    
	      <div class="clear"></div>
	      </div><!-- .grid_product -->
	      
	      <div class="clear"></div>
	      
	      <div class="pagination">
		     <!-- 分页页码 -->
		     <ul>
			    <if condition='$pagedata[currpage] eq 1'>
			    <li class="prev"><span >&#8592;</span></li>
				<else/>
			    <li class="prev"><a href="{:U('Index/prolist',array('page'=>$pagedata[currpage]-1))}">&#8592;</a></li>
				</if>
				<for start="$pagedata[showfirst]" name="j" end="$pagedata[showfirst]+$pagedata['showpageAll']">
			    	<li class="curent"><a href="{:U('Index/prolist',array('page'=>$j,'perpage'=>$perpage,'orderby'=>$orderby))}">{$j}</a></li>
			    </for>
			     <if condition='$pagedata[currpage] eq $pagedata[pageAll]'>
			    <li class="next"><span >&#8594;</span></li>
				<else/>
			    <li class="next"><a href="{:U('Index/prolist',array('page'=>$pagedata[currpage]+1))}">&#8594;</a></li>
				</if>
		     </ul>
	      </div><!-- .pagination -->
	      <p class="pagination_info">Displaying 1 to 12 (of 100 products)</p>
       </div><!-- #content -->
       
      <div class="clear"></div>
      
    </div><!-- .container_12 -->
  </section><!-- #main -->
  
  <div class="clear"></div>
  <script>
$(function(){
	$("#orderby,#perpage").change(function(){
		$("#perorder").submit();
	});
	
});
  
  
  </script>